<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>登录</title>
</head>
<body>
    <p>
        <label for="">账号：</label><input type="text" class="username">
    </p>
    <p>
        <label for="">密码：</label><input type="password" class="password">
    </p>
    <button class="logBtn">登录</button>

    <script>
        let logBtn = document.querySelector('.logBtn');
        logBtn.onclick = () =>{
            // 获取信息
            let _username = document.querySelector('.username').value;
            let _password = document.querySelector('.password').value;

            // ajax请求
            let xhr = new XMLHttpRequest();
            xhr.open('post','http://localhost:2003/login',true);
            // 设置请求头
            xhr.setRequestHeader("content-type","application/X-WWW-form-urlencoded");
            xhr.send("username="+_username+"&password="+_password);

            // 处理响应
            xhr.onload = () =>{
                let data = JSON.parse(xhr.responseText);
                if(data.code==1){
                    alert('登录成功！')
                }else{
                    alert('登录失败，请重新输入正确帐密！')
                }
            }
        }
        
    </script>
</body>
</html>